<template>
  <el-select
    :value="value"
    :placeholder="placeholder"
    :clearable="clearable"
    :filterable="filterable"
    :disabled="disabled"
    :multiple="multiple"
    :collapse-tags="collapsetags"
    @input="handleInput"
    @blur="handleBlur"
    @change="handleChange($event, filterMap)"
    @focus="handleFocus"
    @click.native="fleshUrl"
  >
    <el-option
      v-for="(role, index) in filterMap"
      :key="index"
      :label="role.code_cn_desc"
      :value="role.code_id"
      @click.native="handelIndex(index)"
    />
  </el-select>
</template>

<script>
import selectComponents from './selectComponents'
import { mapGetters } from 'vuex'
import request from '@/utils/request'
import SERVER from '@/api/server'
export default {
  name: 'RSelect',
  mixins: [selectComponents],
  data() {
    return {
      filterMap: [],
      requesturl: ''
    }
  },
  computed: {
    ...mapGetters(['dictMap'])
  },
  watch: {
    url: {
      handler(curVal, oldVal) {
        this.querybyurl()
      },
      immediate: true
    },
    type: {
      handler(curVal, oldVal) {
        this.querybytype()
      },
      immediate: true
    },
    excludeCode: {
      handler(curVal, oldVal) {
        this.querybytype()
      },
      immediate: true
    },
    includeCode: {
      handler(curVal, oldVal) {
        this.querybytype()
      },
      immediate: true
    }
    // value(curVal, val) {
    //   if (curVal !== undefined && curVal !== '' && this.filterMap.length > 0) {
    //     for (var i = 0; i < this.filterMap.length; i++) {
    //       if (val === this.filterMap[i].code_id) {
    //         this.$emit('update:labelvalue', this.filterMap[i].code_cn_desc)
    //         return
    //       }
    //     }
    //   }
    // }
  },
  methods: {
    querybyurl() {
      if (this.url !== undefined && this.url !== '') {
        if (this.father !== undefined && this.father === '') {
          return
        }
        this.requesturl = `${SERVER[this.model]}` + this.url
        request
          .get(this.requesturl)
          .then(response => {
            if (this.excludeCode !== undefined && this.excludeCode !== '') {
              response = response.filter((item) => {
                return (this.excludeCode.indexOf(item[this.selectid]) === -1)
              })
            }

            response.forEach(
              el => (
                // eslint-disable-next-line no-sequences
                (el.code_id = el[this.selectid]), (el.code_cn_desc = el[this.selectname])
              )
            )
            this.filterMap = response
            this.$emit('get-FilterMap', true)
          })
          .catch(err => {})
      } else {
        this.filterMap = []
      }
    },
    querybytype() {
      if (this.type !== undefined) {
        if (this.excludeCode !== undefined && this.excludeCode !== '') {
          this.filterMap = []
          const typeArr = this.dictMap[this.type]
          if (typeArr !== undefined && typeArr.length > 0) {
            for (let i = 0; i < typeArr.length; i++) {
              if (this.excludeCode.indexOf(typeArr[i].code_id) === -1) {
                // 不在排除范围内，添加
                this.filterMap.push(typeArr[i])
              }
            }
          }
        } else if (this.includeCode !== undefined && this.includeCode !== '') {
          this.filterMap = []
          const typeArr = this.dictMap[this.type]
          if (typeArr !== undefined && typeArr.length > 0) {
            for (let i = 0; i < typeArr.length; i++) {
              if (this.includeCode.indexOf(typeArr[i].code_id) > -1) {
                // 不在排除范围内，添加
                this.filterMap.push(typeArr[i])
              }
            }
          }
        } else {
          this.filterMap = this.dictMap[this.type]
        }
      }
    },
    handelIndex(index) {
      this.$emit('update:labelvalue', this.filterMap[index].code_cn_desc)

      // this.$emit('change', index, this.filterMap)
    },
    fleshUrl() {
      if (this.url) {
        this.querybyurl()
      }
      // if (this.type) {
      //   this.querybytype()
      // }
    }
  }
}
</script>
